

/* eslint-disable no-unused-vars */
import Phaser from "phaser";
import skyImg from "@renderer/assets/images/sky.png";
import groundImg from "@renderer/assets/images/ground.png";
import dudeImg from "@renderer/assets/images/dude.png";
import starImg from "@renderer/assets/images/star.png";
import fireImg from "@renderer/assets/images/fire.png";

const bodyWidth = 550;
const bodyHidth = 300;
const widthCenter= bodyWidth/2;
const gravity = 300; // 重力

var phaser = null

phaser = new Phaser.Game({
  type: Phaser.AUTO,
  width: bodyWidth,
  height: bodyHidth,
  // 物理引擎
  physics: {
    default: "arcade", // 使用 Arcade 物理系统
    arcade: {
      gravity: { y: gravity }, // 重力向下 为300像素/秒
      debug: false, //不显示调试图形
    },
  },
  // 定义游戏场景，包括预加载资源 (preload)、创建游戏对象 (create) 和更新游戏状态 (update) 的方法
  scene: {
    preload: preload,
    create: create,
    update: update,
  },
});

var platforms,player,cursors,stars,scoreText,fires;
var score = 0;
var gameOver = false;

//游戏资源预加载
 function preload() {
  // console.log(phaser) // Game Object
  // console.log(this) // Scene Object
  this.load.image("sky",  skyImg);
  this.load.image("ground", groundImg); // 100*13
  // // 加载精灵 作为精灵表单（sprite sheet）载入
  this.load.spritesheet('dude', dudeImg,{ frameWidth: 32, frameHeight: 48 });
  this.load.image("star", starImg);
  this.load.image("fire", fireImg);
}

// 游戏场景创建
function create() {
  this.add.image(0, 0, "sky").setOrigin(0,0); // 背景居中

  // 创建一个静态物理组 静态物理组中的物体不会受到重力影响，也不会移动，但它们仍然可以与其他动态物体发生碰撞
  platforms = this.physics.add.staticGroup();
  platforms.create(50, 100, "ground").refreshBody();
  platforms.create(250, 130, "ground").refreshBody();
  platforms.create(bodyWidth-100, 190, "ground").setScale(2,1).refreshBody();
  platforms.create(widthCenter, bodyHidth-13, "ground").setScale(6,2).refreshBody();

  // 创建精灵（动态物理组）
  player = this.physics.add.sprite(30,200,"dude");
  player.setBounce(0.2); //0.2的反弹值,它跳起后着地时始终会弹起0.2
  player.setCollideWorldBounds(true); // 禁止玩家走出可视区域

  this.anims.create({
    key: 'left',
    frames: this.anims.generateFrameNumbers('dude',{start:0,end:3}), // 使用0-3帧
    frameRate:10, // 跑动时每秒10帧
    repeat:-1, // 重复播放
  })

  this.anims.create({
    key: 'turn',
    frames: [ { key: 'dude', frame: 4 } ],
    frameRate: 20
});

  this.anims.create({
    key: 'right',
    frames: this.anims.generateFrameNumbers('dude', { start: 5, end: 8 }),
    frameRate: 10,
    repeat: -1
});

  player.body.setGravityY(gravity); // 玩家重力
  this.physics.add.collider(player, platforms); // 检测二者之间的碰撞和重叠事件

  // 键盘控制
  cursors = this.input.keyboard.createCursorKeys();

  // 创建星星
  stars = this.physics.add.group({
    key: 'star',
    repeat: 9, // 复制9次 共10颗
    setXY: { x: 12, y: 0, stepX: 55 }, // 分布位置
    setScale: { x: 0.5, y: 0.5 }, // 缩小星星的图片
  })
  this.physics.add.collider(stars, platforms); // 设置碰撞
  // 随机设置星星的弹力
  stars.children.iterate(function (child) {
    child.setBounceY(Phaser.Math.FloatBetween(0.4, 0.8));
  });
  this.physics.add.overlap(player, stars, collectStar, null, this); // 玩家和星星之间的碰撞后 执行collectStar函数

  // 显示分数
  scoreText = this.add.text(16, 16, `Score: ${score}`, { fontSize: '20px', fill: '#000' });

  // 创建火球
  // fires = this.physics.add.group(); // 第一次不显示 不需要传值
  fires = this.physics.add.group({
    key: 'fire',
    repeat: 9, // 复制9次 共10颗
    setXY: { x: 12, y: 0, stepX: 55 }, // 分布位置
    setScale: { x: 0.5, y: 0.5 }, // 缩小星星的图片
  }); // 第一次不显示 不需要传值
  this.physics.add.collider(fires, platforms); // 设置碰撞
  this.physics.add.overlap(player, fires, hitBomb, null, this); // 玩家和火球之间的碰撞后 执行hitBomb函数
}

// 游戏逻辑实现
function update() {
  if(gameOver) return

  // 键盘控制
  if(cursors.left.isDown){
    player.setVelocityX(-160)
    player.anims.play('left',true)
  }else if (cursors.right.isDown){
    player.setVelocityX(160)
    player.anims.play('right',true)
  }else{
    player.setVelocityX(0)
    player.anims.play('turn')
  }
  // 按下up键 && 玩家正与地面接触
  if(cursors.up.isDown && player.body.touching.down){
    player.setVelocityY(-(gravity+30))
  }
}

// 收集星星后的回调
function collectStar(player,star){
  star.disableBody(true, true); // 移除星星
  score += 10; // 加分
  scoreText.setText(`Score: ${score}`)

  if(stars.countActive(true) === 0){
    // 全部星星收集完毕 就重新激活所有星星
    stars.children.iterate(function (child) {
      child.enableBody(true, child.x, 0, true, true);
    });
  }else{
    // 取一个随机x坐标给它，始终在玩家的对侧画面，以便给玩家个机会
    const x = (player.x < widthCenter) ? Phaser.Math.Between(widthCenter, bodyWidth) : Phaser.Math.Between(0, widthCenter);
    const fire = fires.create(x, 1, 'fire')
    fire.setBounce(1);
    fire.setCollideWorldBounds(true);
    fire.setVelocity(Phaser.Math.Between(-200, 200), 20);
  }
}

function hitBomb(player,fire){
  this.physics.pause();
  player.setTint(0xff0000); // 玩家变红色
  player.anims.play('turn');
  gameOver = true;
  console.log('@@',this)
  // setTimeout(() => {
  //   // this.add.image(0, 0, "sky").setOrigin(0,0); // 背景居中
  //   this.add.text(16, 16, `Score: ${score}`, { fontSize: '20px', fill: '#000' });
  // }, 2000);

}

export default phaser;
